import { Component } from "react";
const HocButton = (CommButton) => {

  class ButtonWarppedComponent extends Component {
    constructor() {
      super()
      this.state = {
        isAuth: false // 是否有按钮的权限
      }
      this.handlerAuth = this.handlerAuth.bind(this)
    }
    handlerAuth() {
      /*
            增加：[3,4,5];
            删除 ：【5】
            修改 ： 【4，5】
            查看 ：【1，2，3，4，5】
      */
      let authList = [];
      const { buttonName, userInfo } = this.props;
      if (buttonName === '增加') {
        authList = [3, 4, 5]
      } else if (buttonName === '删除') {
        authList = [5]
      } else if (buttonName === '修改') {
        authList = [4, 5]
      } else if (buttonName === '查看') {
        authList = [1, 2, 3, 4, 5]
      }

      // 判断用户是否有这个按钮的权限
      this.setState({
        isAuth: authList.includes(userInfo.role)  // 如果包括，就返回true,否则返回false.
      })
    }
    componentDidMount() {
      this.handlerAuth();
    }
    render() {
      return (
        <>
          {
            this.state.isAuth ?
              <CommButton {...this.props} disabled={false}></CommButton>
              : null
            // <CommButton {...this.props} disabled={true}></CommButton>
            // 如果返回null,则不渲染按钮，
          }
        </>
      )
    }
  }

  // app.js中，调用的是这个新组件
  return ButtonWarppedComponent

}

export default HocButton;